.search-coze {
  position: relative;

  .mask {
    position: fixed;
    top: 2rem;
    left: 50%;
    width: calc(100vw - 4rem);
    max-width: 70rem;
    height: calc(100vh - 4rem);
    transform: translateX(-50%);
    display: flex;
    overflow: hidden;
    flex-direction: column;
    border-radius: 16px;
    padding: 24px 16px;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 1000;

    .screen-box {
      flex: 1;
      margin-bottom: 12px;
      overflow: auto;

      .chatting {
        display: flex;
        margin: 12px 0;

        .content {
          max-width: 92%;
          display: inline-block;
          padding: 8px 16px;
          border-radius: 16px;
        }
      }

      .chatting-ai {
        justify-content: flex-start;

        .content {
          background-color: #494949;
          color: #ffffff;
        }
      }

      .chatting-user {
        justify-content: flex-end;

        .content {
          background-color: #414156;
          color: #ffffff;
        }
      }
    }

    .input-box {
      height: 6rem;

      textarea {
        width: 100%;
        height: 100%;
        resize: none;
        padding: 12px 1rem;
        border-radius: 16px;
        background-color: #1d1d1d;
        color: #ffffff;
      }
    }
  }

  .button-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 2em;
    height: 2em;
    border: none;
    background: rgba(180, 83, 107, 0.11);
    border-radius: 5px;
    transition: background 0.5s;
    cursor: pointer;

    .x {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      width: 1em;
      height: 1.5px;
      background-color: rgb(255, 255, 255);
      transform: translateX(-50%) rotate(45deg);
    }

    .y {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      width: 1em;
      height: 1.5px;
      background-color: #fff;
      transform: translateX(-50%) rotate(-45deg);
    }
  }

  .button-close:hover {
    background-color: rgb(211, 21, 21);
  }

  .button-close:active {
    background-color: rgb(130, 0, 0);
  }
}

.search-coze-hidden {
  display: none;
}
